Introduction

In this reading, you will recap the key principles of UX and UI.

User experience (UX) refers to how a user interacts with or utilizes a product. UX design aims to boost user satisfaction by giving users meaningful, relevant and satisfying experiences. While the user interface (UI) is the primary means through which a user communicates with a computer, phone, or other device.

For more detail, please revisit the following lesson items in the Principles of UX and UI design course:

Learning more about UX and UI will help you create a functional and user-friendly food-ordering app for the Little Lemon restaurant.

UX

There are five primary stages in the UX design process.

Stage 1 - Empathize:

Empathizing means that you first identify what kind of consumer your average user is and then you try to understand potential users’ needs by placing yourself in their shoes. To this end, you get permission to interview and observe Adrian's customers at various stages of making and completing an online order from the restaurant. The key here is to understand your users' needs and to identify their frustrations. From the results of this research, a persona can be created that you can reference throughout the design process of your app.

To empathize more with this persona, a user journey map that uncovers moments of frustration and satisfaction in a series of interactions has also been created. Again, this is to provide a detailed view of the customer experience. This will also keep your ideas and solutions grounded and prevent you from making assumptions.

Stage 2 - Define the problem:

Part of user research is identifying the problem. You gather and analyze all the information collected from your users and identify the critical issues and needs they have. You should prioritize these frustrations by importance. You now know who your users are, what their frustrations are and what problems you need to solve. After this, you are ready to move on to the next stage.

Stage 3 - Ideation:

Once you know who the average user is and the issues you need to solve, you can ideate the UX. Ideating is generating ideas and solutions for the identified problem through sketching, brainstorming, user flow, mind mapping and even handwriting notes. The key here is to keep an open mind and not commit to one specific idea, which may be iterated throughout the design process. To iterate is to reflect on your work and refine and improve your design. You will sketch out your ideas into something that will address the Little Lemon customers’ needs. You will then develop them into wireframes. A wireframe is a two-dimensional representation of the user interface concerned with the functionalities provided, the everyday actions users will take and the placement and hierarchy of content.

Stage 4 - Prototype:

This is a simulation of the final product. You have iterated and refined your ideas into a new solution, but you have yet to prove it will work for everyone and so you can release it. You should first simulate how it will behave with a prototype, take your wireframe and flesh it out. Give it some color, put in some buttons and text and make it interactive. You can simulate a real scenario for your customers to help them achieve their required goals. Since UX is an iterative process based on user and client feedback, you may also have to iterate at this stage. So, your ideas are constantly being refined into something approaching a final design solution.

Stage 5 - Test and build:

You need to test your design. The testing stage is where you present your solution to users and get their feedback. You create a test script with clear instructions for achieving a task or tasks. Your test participants interact with your prototype while trying to accomplish the task. Any frustrations can be communicated and highlighted at this stage and you can go back and address them before the next step. You should listen to users, empathize with them and aim to solve their needs through iterative design techniques. You watch them using your product and you tweak it to make it more intuitive and easier to use. Now it's time to build!

Following these steps can help ensure you create a product that addresses the needs of your users and offers a great user experience.

UI

While there are no specific UI design processes, it is crucial to get it right. When UI is done correctly, users don't notice it; but, when it is done poorly, or not at all, the users will have a bad experience.

A good UI design must be consistent. Consistency is one of the critical factors in usability and learnability. se UI components and design patterns like those used in the associated design, such as menus, prompts, buttons, input fields, layout, colors and typography. There are several UI consistency types, including:

Conclusion

You should now be able to explain the differences between UX and UI and recognize the importance of putting the customer at the forefront of your decisions on any project.